


<template>
  <div style="height: 100%; width: 100%; display: flex; flex-direction: column">
    <div
      id="onekit_navigationBar"
      :style="{
        display: 'flex',
        'justify-content': 'space-between',
        'align-item': 'center',
        'flex-shrink': 0,
        background: WINDOW_JSON.navigationBarBackgroundColor,
      }"
    >
    <!--
      <template v-if="WINDOW_JSON.navigationBarTextStyle == 'black'">
        <img
          alt="back"
          id="onekit_navigationBar_back"
          :style="{
            width: '30px',
            height: '30px',
            cursor: 'pointer',
            visibility: isRoot ? 'hidden' : 'visible',
          }"
          src="../../../public/onekit/black/back.png"
          @click="back_click"
        />
        <div
          id="onekit_navigationBar_menu"
          style="
            border-radius: 15px;
            height: 30px;
            margin-right: 5px;
            border: 1px solid #000;
          "
        >
          <img
            id="onekit_navigationBar_more"
            alt="more"
            src="../../../public/onekit/black/more.png"
            style="
              position: relative;
              width: 30px;
              height: 30px;
              cursor: pointer;
            "
          />
          <img
            id="onekit_navigationBar_quit"
            alt="quit"
            @click="quit_click"
            src="../../../public/onekit/black/quit.png"
            style="
              position: relative;
              width: 30px;
              height: 30px;
              cursor: pointer;
            "
          />
        </div>
      </template>
      <template v-else>
        <img
          alt="back"
          id="onekit_navigationBar_back"
          :style="{
            width: '30px',
            height: '30px',
            cursor: 'pointer',
            visibility: isRoot ? 'hidden' : 'visible',
          }"
          src="../../../public/onekit/white/back.png"
          @click="back_click"
        />
        <div
          id="onekit_navigationBar_menu"
          style="
            border-radius: 15px;
            height: 30px;
            margin-right: 5px;
            border: 1px solid #fff;
          "
        >
          <img
            id="onekit_navigationBar_more"
            alt="more"
            src="../../../public/onekit/white/more.png"
            style="
              position: relative;
              width: 30px;
              height: 30px;
              cursor: pointer;
            "
          />
          <img
            id="onekit_navigationBar_quit"
            alt="quit"
            @click="quit_click"
            src="../../../public/onekit/white/quit.png"
            style="
              position: relative;
              width: 30px;
              height: 30px;
              cursor: pointer;
            "
          />
        </div>
      </template>
      -->
        <img
          alt="back"
          id="onekit_navigationBar_back"
          :style="{
            width: '30px',
            height: '30px',
            cursor: 'pointer',
            visibility: isRoot ? 'hidden' : 'visible',
          }"
          :src="`/onekit/${WINDOW_JSON.navigationBarTextStyle}/back.png`"
          @click="back_click"
        />
        <div
          id="onekit_navigationBar_menu"
          style="
            border-radius: 15px;
            height: 30px;
            margin-right: 5px;
            border: 1px solid #000;
          "
        >
          <img
            id="onekit_navigationBar_more"
            alt="more"
            :src="`/onekit/${WINDOW_JSON.navigationBarTextStyle}/more.png`"
            style="
              position: relative;
              width: 30px;
              height: 30px;
              cursor: pointer;
            "
          />
          <img
            id="onekit_navigationBar_quit"
            alt="quit"
            @click="quit_click"
            :src="`/onekit/${WINDOW_JSON.navigationBarTextStyle}/quit.png`"
            style="
              position: relative;
              width: 30px;
              height: 30px;
              cursor: pointer;
            "
          />
        </div>
      <div
        id="onekit_navigationBar_title_box"
        style="
          width: 100%;
          margin: 0;
          text-align: center;
          ftop: 0;
          left: 0;
          position: absolute;
          pointer-events: none;
        "
      >
        <img
          id="onekit_navigationBar_title_loading"
          style="display: none"
          src="../../../public/onekit/loading_nav.gif"
        />
        <h2
          id="onekit_navigationBar_title"
          style="
            font-size: 14px;
            line-height: 50px;
            ont-weight: normal;
            display: inline;
          "
        >
          {{ WINDOW_JSON.navigationBarTitleText }}
        </h2>
      </div>
    </div>

    <router-view
      v-if="isTabs"
      style="height: calc(100% - 50px)"
      @setNavigationBarTitle="setNavigationBarTitle"
      @updatewindowjson="routerView_updatewindowjson"
    ></router-view>

    <div
      v-else
      style="height: calc(100% - 50px);overflow:scroll;"
     
    >
      <router-view
        @setNavigationBarTitle="setNavigationBarTitle"
        @updatewindowjson="routerView_updatewindowjson"
        @startPullDownRefresh="routerView_startPullDownRefresh"
        @stopPullDownRefresh="routerView_stopPullDownRefresh"
      ></router-view>
    </div>

    <div style="left: 0; top: 0; display: none">
      <span data-clipboard-action="copy" @click="copyLink"></span>
    </div>
  </div>
</template>
<script>
//import Vue from 'vue';
//import scroller from 'vue-scroller';
//Vue.use(scroller);
import WebFSO from 'weixin2html/js/WebFSO';
import wx from "../../wx";
import OneKit from "../../OneKit";
import clipboard from "clipboard";
window.clipboard = clipboard;

export default {
  name: "onekit-activity",
  data() {
    return {
      isTabs: false,
      isRoot: false,
      WINDOW_JSON: {
        navigationBarBackgroundColor: "#000000",
        navigationBarTextStyle: "white",
        navigationStyle: "default",
        backgroundColor: "#000000",
        backgroundTextStyle: "dark",
      },
      refreshColor: "#ffffff",
    };
  },
  mounted() {},
  methods: {
    back_click() {
      if (window.enableAlertBeforeUnload) {
        wx.showModal({
          content: window.enableAlertBeforeUnload,
          success: (res) => {
            if (res.confirm) {
              wx.navigateBack({});
            }
          },
        });
      } else {
        wx.navigateBack({});
      }
    },
    setNavigationBarTitle({ title }) {
      this.title = title;
    },
    routerView_updatewindowjson({ WINDOW_JSON }) {
      this.isRoot = OneKit.currentUrl().startsWith(
        `/${window.APP_JSON.pages[0]}`
      );

      let isTabs = false;
      if (window.APP_JSON.tabBar) {
        for (const tab of window.APP_JSON.tabBar.list) {
          if (OneKit.currentUrl().startsWith(`/${tab.pagePath}`)) {
            isTabs = true;
            break;
          }
        }
      }

      this.isTabs = isTabs;
      this.WINDOW_JSON = WINDOW_JSON;
    },
    copyLink() {
      let _this = this;
      let clipboard = new this.clipboard(".cobyOrderSn");
      clipboard.on("success", function () {
        _this.$toast("复制成功");
      });
      clipboard.on("error", function () {
        _this.$toast("复制失败");
      });
    },
    quit_click() {
      let file_list = window.FSO;
      // alert(file_list)
      const filePaths = Object.keys(file_list);
      if (filePaths.length <= 0) {
        return;
      }
      const c = confirm("是否保存文件");
      if (c) {
        WebFSO.save();
      }
    },
    scroller_onRefresh() {
      if (OneKit.current().onPullDownRefresh) {
        OneKit.current().onPullDownRefresh();
      }
    },
    scroller_infinite() {
      /*if (OneKit.current()) {
        this.$refs.scroller.finishInfinite(true);
        if (OneKit.current().onReachBottom) {
          OneKit.current().onReachBottom();
        }
      }*/
    },
    routerView_startPullDownRefresh() {
   //   this.$refs.scroller.triggerPullToRefresh();
    },
    routerView_stopPullDownRefresh() {
     // this.$refs.scroller.finishPullToRefresh();
    },
  },
};
</script>
<style scoped="scoped">
#onekit_navigationBar {
  height: 50px;
  display: flex;
  align-items: center;
  background: #fff;
  z-index: 2147483647;
}
#onekit_navigationBar_title_loading {
  content: " ";
  position: relative;
  border: none;
  background: transparent;
  width: 15px;
  height: 15px;
  margin: -2px 5px;
  padding: 0;
}
</style>